(function(){
    function Process(){
        var breadcrumb = new App.models.Breadcrumb({
            prefix: [
                {text: '状态管理', anchor: '/status'}
            ],
            curr: '进程列表'
        });

        var ProcessTableOpts = {
            el: '#running .process-list',
            columns: [
                {field: 'pid', title: 'pid'},
                {
                    field: 'key',
                    title: '关键字',
                    formatter: function(value, row, index){
                        return widthRestrictedPopover(value, value, 'wordcut-120');
                    }
                },
                {
                    field: 'psStr', 
                    title: 'ps特征',
                    formatter: function(value, row, index){
                        return widthRestrictedPopover(value, value, 'wordcut-240');
                    }
                },
                {field: 'user', title: '启动用户'},
                {
                    field: 'startDate', 
                    title: '启动日期',
                    formatter: function(value, row, index){
                        _list = value.replace(/Z/g, "").split('T');

                        var text = _list[0];
                        var title = _list.join(' ');
                        return textTooltip(title, text);
                    }
                },
                {field: 'port', title: '端口'},
                {
                    field: 'category',
                    title: '类型',
                    formatter: function(value, row, index){
                        var verbose, klass;
                        if(value == 0) return;
                        else if(value == 1){
                            verbose = '系统进程';
                            klass = 'primary';
                        }else if(value == 2){
                            verbose = '业务进程';
                            klass = 'success';
                        }
                        var str = '<span class="label label-' + klass + ' arrowed-in arrowed-in-right btn-register">' + verbose + '</span>';
                        return str;
                    }
                },
                {
                    field: 'operation', 
                    title: '操作',
                    formatter: function(value, row, index){
                        if(row.category == 0){
                            return [
                                '<span class="label label-default btn-register">注册</span>',
                                '<span class="label label-default btn-mark">标记</span>',
                            ].join('');
                        }
                    }
                },
            ],
            opts:  {
                url: App.apiList.process + '/query?minionId=' + App.xbox.minionId,
                toolbar: '#running .toolbar',
            }
        };
        var ProcessTable = App.views.BaseTableView.extend({        
            listener: function(){
                this.$el.on('click', '.btn-register', this.register.bind(this));
                this.$el.on('click', '.btn-mark', this.mark.bind(this));
            },
            getProcInfo: function(idx){
                var data = this.$el.bootstrapTable('getData')[idx];
                return {
                    minionId: '',
                    name: data.key,
                    user: data.user,
                    psStr: data.psStr,
                    ports: data.port,
                    path: '',
                    startCmd: '',
                    remark: '',
                };
            },
            register: function(event){
                App.xbox.idx = $(event.target).parents('tr').attr('data-index');
                var url = [
                    '#process/',
                    App.xbox.minionId,
                    '/',
                    App.xbox.idx
                ].join('');
                // 只修改地址栏, 但不触发路由操作
                App.router.navigate(url, {trigger: false});
                this.eventBus.trigger('renderRegisterView');
            },
            mark: function(event){
                var idx = $(event.target).parents('tr').attr('data-index');
                var data = this.$el.bootstrapTable('getData')[idx];
                $.ajax({
                    type: 'POST',
                    url: App.apiList.sysproc + '/mark',
                    data: {
                        psStr: data['psStr']
                    },
                    success: function(result){
                        console.log(result);
                    }
                });
            }
        });

        var MainView = Backbone.View.extend({
            // el与initialize一样是bk的关键字, 不能重命名为其它
            el: '#page-cnt',
            template:  _.template($("#tpl-process").html()),
            initialize: function() {
                // backbone的事件总线机制, 子视图之间可以由总线上报到主视图再与其他子视图通信
                this.eventBus = _.extend({}, Backbone.Events);
                this.eventBus.on('renderRegisterView', this.renderRegisterView, this);            
                this.breadcrumbView = new App.views.BreadcrumbView({model: breadcrumb});
                // 注意: 模板的渲染要放在表格初始化之前
                this.$el.html(this.template());
                this.procInfoModel = new App.models.ProjectInfo();

                this.procTable = new ProcessTable(Object.assign(
                    {
                        eventBus: this.eventBus,
                    },
                    ProcessTableOpts, 
                ));
                this.registerView = new App.views.RegisterView({
                    eventBus: this.eventBus,
                    model: this.procInfoModel                    
                });
                this.watch();
            },
            watch: function(){
                var _self = this;
                this.eventBus.on('requestSuccess', function(){
                    _self.procTable.$el.bootstrapTable('refresh');
                    _self.registerView.hide();
                });
            },
            renderRegisterView: function(){
                if(!App.xbox.idx) return;

                var procInfo = this.procTable.getProcInfo(App.xbox.idx);
                this.registerView.render(procInfo);
            },
        });
        
        var mainView = new MainView();
    };

    App.modules.Process = Process;

})();
